<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<meta name="viewport" id="vp" content="width=device-width, initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
		<title>消息</title>
		<link href="../../../css/style.css" rel="stylesheet" type="text/css">
		<link href="../../../css/mui.css" rel="stylesheet" type="text/css">
		<style>
			.sendbtnmore {
				width: 80%;
				margin: 0 auto;
				background: #ffbc2a;
				text-align: center;
				color: #fff;
				height: 40px;
				line-height: 40px;
				border-radius: 5px;
				font-size: 16px;
				margin-top: 20px;
				display: none;
			}
			
			.message-wrap {
				position: relative;
			}
			
			.navtypeb {
				position: absolute;
				display: block;
				top: 0.05rem;
				left: 0rem;
				color: #ff0000;
				border: solid 1px #ff0000;
				border-radius: 100%;
				background: #FF3F40;
				color: #fff;
				width: 10px;
				height: 10px;
				font-size: 10px;
				text-align: center!important;
				line-height: 18px;
				z-index: 9;
				display: none;
			}
		</style>
	</head>

	<body>
		<div id="message">
			<div class="message-main">
				<ul>
					<a href="" onclick="return false">
						<li id="notice">
							<div class="message-wrap clearfix">
								<img src="../../../images/icon/a4.png" class="fl" />
								<div class="message-text posir">
									<div class="title">通知公告</div>
									<div class="content z">最新消息都在这里</div>
									<div class="posia time"></div>
								</div>
								<span id="tun" class="navtypeb"></span>
							</div>
						</li>
					</a>
					<a href="javascript:void(0);">
						<li id="schedule">
							<div class="message-wrap clearfix">
								<img src="../../../images/icon/a6.png" class="fl" />
								<div class="message-text posir">
									<div class="title">课程计划</div>
									<div class="content z">孩子课程信息早知道</div>
									<div class="posia time"></div>
								</div>
								<span id="kun" class="navtypeb"></span>
							</div>
						</li>
					</a>
					<a href="javascript:void(0);">
						<li id="recipe">
							<div class="message-wrap clearfix">
								<img src="../../../images/icon/x1.png" class="fl" />
								<div class="message-text posir">
									<div class="title">宝宝食谱</div>
									<div class="content z">营养搭配更透明</div>
									<div class="posia time"></div>
								</div>
								<span id="sun" class="navtypeb"></span>
							</div>
						</li>
					</a>
					<a href="javascript:void(0);">
						<li id="activity">
							<div class="message-wrap clearfix">
								<img src="../../../images/icon/notice3.png" class="fl" />
								<div class="message-text posir">
									<div class="title">活动通知</div>
									<div class="content z">最新活动</div>
									<div class="posia time"></div>
								</div>
								<span id="hun" class="navtypeb"></span>
							</div>
						</li>
					</a>
				</ul>
				<div @tap="sendMsg()" class="sendbtnmore" id="sendbtnmore">发布</div>
			</div>
		</div>
		<script src="../../../js/mui.js"></script>
		<script src="../../../js/vue.min.js"></script>
		<script src="../../../js/jquery-1.8.3.min.js"></script>
		<script src="../../../js/app.js"></script>
		<script src="../../../js/token.js"></script>
		<script type="text/javascript">
			mui.init();
			var state;
			var uid;
			mui.plusReady(function() {
				//获取通知公告消息数量
				state = app.getState();
				uid = state.userid;
				memberToken = state.memberToken
				mui.post(Apiurl+'index/tong', {
					uid: state.userid,
					memberToken: memberToken
				}, function(data) {
					if(data.tun == 1) {
						document.getElementById('tun').style.display = "block";
					}
					if(data.kun == 1) {
						document.getElementById('kun').style.display = "block";
					}
					if(data.sun == 1) {
						document.getElementById('sun').style.display = "block";
					}
					if(data.hun == 1) {
						document.getElementById('hun').style.display = "block";
					}

					if(data.member != 1) {
						document.getElementById('sendbtnmore').style.display = "block";
					}
				}, 'json')
				titlestyle = {
					"render": "always",
					"popGesture": "hide",
					"bounce": "vertical",
					"bounceBackground": "#efeff4",
					"titleNView": { //详情页原生导航配置
						backgroundColor: '#fff', //导航栏背景色
						titleText: '', //导航栏标题
						titleColor: '#000', //文字颜色
						autoBackButton: true, //自动绘制返回箭头
						splitLine: { //底部分割线
							color: '#dfdfdf'
						}
					}
				}
				document.getElementById("notice").addEventListener('tap', function() {
					titlestyle.titleNView.titleText="通知公告";
					document.getElementById('tun').style.display = 'none';
					mui.openWindowWithTitle({
						url: 'notice.html',
						id: 'notice',
						preload: true,
						show: {
							aniShow: 'pop-in',
							autoShow: true
						},
						styles: titlestyle,
						waiting: {
							autoShow: true
						}
					});
				});
				document.getElementById("schedule").addEventListener('tap', function() {
					titlestyle.titleNView.titleText="课程计划";
					document.getElementById('kun').style.display = 'none';
					mui.openWindowWithTitle({
						url: 'schedule.html',
						id: 'schedule',
						preload: true,
						show: {
							aniShow: 'pop-in',
							autoShow: true
						},
						styles: titlestyle,
						waiting: {
							autoShow: true
						}
					});
				});
				document.getElementById("recipe").addEventListener('tap', function() {
					titlestyle.titleNView.titleText="宝宝食谱";
					document.getElementById('sun').style.display = 'none';
					mui.openWindowWithTitle({
						url: 'recipe.html',
						id: 'recipe',
						preload: true,
						show: {
							aniShow: 'pop-in',
							autoShow: true
						},
						styles: titlestyle,
						waiting: {
							autoShow: true
						}
					});
				});
				document.getElementById("activity").addEventListener('tap', function() {
					titlestyle.titleNView.titleText="最新活动";
					document.getElementById('hun').style.display = 'none';
					mui.openWindowWithTitle({
						url: 'activity.html',
						id: 'activity',
						preload: true,
						show: {
							aniShow: 'pop-in',
							autoShow: true
						},
						styles: titlestyle,
						waiting: {
							autoShow: true
						}
					});
				});
			});
			
			var message = new Vue({
				el: '#message',
				data: {
					items: []
				},
				methods: {
					sendMsg: function() {
						if(mui.os.plus) {
							var a = [{
								title: "通知公告"
							}, {
								title: "课程计划"
							}, {
								title: "宝宝食谱"
							}, {
								title: "活动通知"
							}];
							plus.nativeUI.actionSheet({
								title: "发布类型",
								cancel: "取消",
								buttons: a
							}, function(b) {
								var placeholder = '';
								var type = '';
								if(b.index == 1) {
									titlestyle.titleNView.titleText = "发布通知";
									placeholder = '请输入您想发布的通知';
									type = 1;
								} else if(b.index == 2) {
									titlestyle.titleNView.titleText = "发布课程";
									placeholder = '请输入您想发布的课程标题';
									type = 2;
								} else if(b.index == 3) {
									titlestyle.titleNView.titleText = "发布食谱";
									placeholder = '请输入您想发布食谱名称';
									type = 3;
								} else if(b.index == 4) {
									titlestyle.titleNView.titleText = "发布活动";
									placeholder = '请输入您想发布的活动'
									type = 6;
								} else {
									return false
								}
								mui.openWindowWithTitle({
									url: 'sendmore.html',
									id: 'sendmore',
									extras: {
										placeholder: placeholder,
										type: type
									},
									show: {
										aniShow: 'pop-in',
										autoShow: true
									},
									styles: titlestyle,

								});
							})
						}
					},

				}
			});
		</script>
	</body>

</html>